<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./iconfont/iconfont.css">
    <link rel="stylesheet" href="./css/wx.css">
</head>
<body>
    <!-- 头部 -->
    <div class="shortcut">
        <div class="s-1">
            <div><img src="./img/wx.png" alt=""></div>
            <div class="title">微信官方文档 · 
                <div class="trigger">
                    <a href="#">
                        小程序
                        <i class="iconfont icon-xiajiantou"></i>
                    </a>
                    <ul class="list">
                        <li class="l-1"><a href="#">小程序</a></li>
                        <li><a href="#">小游戏</a></li>
                        <li><a href="#">公众号</a></li>
                        <li><a href="#">服务号</a></li>
                        <li><a href="#">开放平台</a></li>
                        <li><a href="#">企业微信</a></li>
                        <li><a href="#">微信支付</a></li>
                        <li><a href="#">视频号</a></li>
                        <li><a href="#">微信小店</a></li>
                        <li><a href="#">智能对话</a></li>
                        <li><a href="#">腾讯小微</a></li>
                    </ul>
                </div>
            </div>
            
        </div>
        <div class="s-2">
            <ul>
                <li><a href="#" class="a">开发</a></li>
                <li><a href="#">介绍</a></li>
                <li><a href="#">设计</a></li>
                <li><a href="#">运营</a></li>
                <li><a href="#">数据</a></li>
                <li><a href="#">安全</a></li>
            </ul>
        </div>
        <div class="s-3">
            <ul>
                <li class="li"><a href="">社区</a></li>
                <li class="li"><a href="">学堂</a></li>
                <li class=""><a href=""><i class="iconfont icon-translate"></i></a></li>
                <li class=""><a href=""><i class="iconfont icon-fangdajing"></i></a></li>
            </ul>
        </div>
    </div>
    <!-- 导航栏 -->
    <div class="nav">
        <ul>
            <li class="a"><a href="">指南</a></li>
            <li><a href="">框架</a></li>
            <li><a href="">组件</a></li>
            <li><a href="">api</a></li>
            <li><a href="">服务器</a></li>
            <li class="trigger"><a href="">平台能力</a><i class="iconfont icon-xiajiantou"></i>
                <ul class="list">
                    <li><a href="">行业能力</a></li>
                    <li><a href="">商业能力</a></li>
                    <li><a href="">多端能力</a></li>
                    <li><a href="">服务市场</a></li>
                    <li><a href="">城市服务</a></li>
                    <li><a href="">付费能力</a></li>
                    <li><a href="">拓展能力</a></li>
                </ul>
            </li>
            <li><a href="">工具</a></li>
            <li class="trigger"><a href="">云服务</a><i class="iconfont icon-xiajiantou"></i>
                <ul class="list">
                    <li><a href="">云开发</a></li>
                    <li><a href="">云托管</a></li>
                </ul>
            </li>
            <li><a href="">更新日志</a></li>
        </ul>
    </div>
    <!-- 主体 -->
    <div class="main">
        <div class="main-1"> 
            <div class="main-1-1">
                <ul>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="#">起步</a></li>
                    <li><span></span><i></i><a href="">目录结构</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">配置小程序</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">小程序框架</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">小程序运行时</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">Skyline 渲染引擎</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">glass-easel 组件框架</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">自定义组件</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">插件</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">基础能力</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">XR-FRAME</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">连接硬件能力</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">开放能力</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">调试</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">性能与体验</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">安全指引</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">健康运营指引</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">企业微信兼容</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">基础库</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">小程序搜索</a></li>
                    <li><span><i class="iconfont icon-youjiantou"></i></span><a href="">PC 小程序</a></li>
                </ul>
            </div>
        </div>
        <div class="main-2">
            <div class="main-2-box">
                <div class="box-title">
                    <div class="box-1">微信开放文档  /</div>
                    <div class="box-2">开发</div>
                </div>
                <div class="box-title2">开发指南</div>
                <div class="box-p">
                    <p>小程序提供了一个简单、高效的应用开发框架和丰富的组件及API，帮助开发者在微信中开发具有原生 APP 体验的服务。</p>
                    <p>本章分主题的介绍了小程序的开发语言、框架、能力、调试等内容，帮助开发者快速全面的了解小程序开发的方方面面。</p>
                    <p>想要更具体了解关于框架、组件、API的详细内容，请参考对应的参考文档：</p>
                </div>
                <div class="box-ul">
                    <ul>
                        <li><a href="#">小程序框架参考文档</a></li>
                        <li><a href="#">小程序组件参考文档</a></li>
                        <li><a href="#">小程序 API 参考文档</a></li>
                        <li><a href="#">小程序服务端 API 参考文档</a></li>
                        <li><a href="#">微信开发者工具参考文档</a></li>
                        <li><a href="#">微信云托管参考文档</a></li>
                        <li><a href="#">微信云开发参考文档</a></li>
                    </ul>
                </div>
                <div class="tutorial">
                    <div class="tutorial-box">
                        <div class="tutorial-title">
                            官方教程 · 小程序开发起步
                        </div>
                        <div class="tutorial-content">
                        <p>学习 5 节课程，从 0 至 1 做第一个属于你的小程序，深入浅出了解小程序开发。本系列视频，由腾讯课堂 NEXT 学院、微信学堂联合出品。</p>
                        <img src="./img/1.png" alt="">
                        </div>
                    </div>
                </div>
                </div>
                <div class="foot">
                    <a href="">关于腾讯</a>
                    <a href="">文档中心</a>
                    <a href="">辟谣中心</a>
                    <a href="">客服中心</a>
                    <div class="foot-1">
                        Copyright © 2012-2025 Tencent. All Rights Reserved.
                    </div>
            </div>
        </div>
        
    </div>

</body>
</html>